import ColoredText from '@/components/ColoredText';

const padZero = (n: number) => String(n).padStart(2, '0');

const FreeTimes = (props: { times: number[]; size?: 'default' | 'small' }) => {
  const { times = [], size = 'default' } = props;
  if (times.length < 2) return <span>无</span>;
  const [start, end] = times;
  if (start === end) return <span>全天收费</span>;
  else if (start > end) {
    const startH = Math.floor(start / 60);
    const startM = start % 60;
    const endH = Math.floor(end / 60);
    const endM = end % 60;
    return size == 'default' ? (
      <span>
        当日 <ColoredText text={padZero(startH)} /> 点 <ColoredText text={padZero(startM)} /> 分 至
        次日 <ColoredText text={padZero(endH)} /> 点 <ColoredText text={padZero(endM)} /> 分
      </span>
    ) : (
      <span>
        当日 <ColoredText text={padZero(startH)} />:<ColoredText text={padZero(startM)} /> 至 次日{' '}
        <ColoredText text={padZero(endH)} />:<ColoredText text={padZero(endM)} />
      </span>
    );
  } else {
    const startH = Math.floor(start / 60);
    const startM = start % 60;
    const endH = Math.floor(end / 60);
    const endM = end % 60;
    return size == 'default' ? (
      <span>
        每日 <ColoredText text={padZero(startH)} /> 点 <ColoredText text={padZero(startM)} /> 分 至{' '}
        <ColoredText text={padZero(endH)} /> 点 <ColoredText text={padZero(endM)} /> 分
      </span>
    ) : (
      <span>
        每日 <ColoredText text={padZero(startH)} />:<ColoredText text={padZero(startM)} /> 至{' '}
        <ColoredText text={padZero(endH)} />:<ColoredText text={padZero(endM)} />
      </span>
    );
  }
};

export default FreeTimes;
